import { deepClone } from "./index"

// 表单属性【右面板】
export let formConf = {
  formRef: 'elForm',
  formModel: 'formData',
  size: 'medium',
  labelPosition: 'right',
  labelWidth: 100,
  formRules: 'rules',
  gutter: 15,
  disabled: false,
  // span: 24,
  formBtns: true,
  unFocusedComponentBorder: true,
}

// 输入型组件 【左面板】
export let inputComponents = [
  {
    // 组件的自定义配置
    __config__: {
      label: '单行输入框',
      labelWidth: null,
      showLabel: true,
      changeTag: true,
      tag: 'form-input',
      tagIcon: 'input',
      defaultValue: undefined,
      required: true,
      layout: 'colFormItem',
      span: 24,

      // 正则校验规则
      regList: []
    },
    // 其余的为可直接写在组件标签上的属性
    placeholder: '请输入',
    style: { width: '100%' },
    clearable: true,
    'prefix-icon': '',
    'suffix-icon': '',
    maxlength: 255,
    'show-word-limit': false,
    disabled: false, // 编辑状态禁用
    readonly: false, // 编辑状态的只读
    showonly: false, // 只显示详情状态（非编辑状态）
  },
  {
    __config__: {
      label: '多行输入框',
      labelWidth: null,
      showLabel: true,
      tag: 'form-input',
      tagIcon: 'textarea',
      defaultValue: undefined,
      required: true,
      layout: 'colFormItem',
      span: 24,
      regList: [],
      changeTag: true,
    },
    type: 'textarea',
    placeholder: '请输入',
    autosize: {
      minRows: 4,
      maxRows: 4
    },
    style: { width: '100%' },
    maxlength: 20000,
    'show-word-limit': false,
    readonly: false,
    disabled: false
  },
  // {
  //   __config__: {
  //     label: '密码',
  //     showLabel: true,
  //     labelWidth: null,
  //     changeTag: true,
  //     tag: 'form-input',
  //     tagIcon: 'password',
  //     defaultValue: undefined,
  //     layout: 'colFormItem',
  //     span: 24,
  //     required: true,
  //     regList: [],

  //   },
  //   __slot__: {
  //     prepend: '',
  //     append: ''
  //   },
  //   placeholder: '请输入',
  //   'show-password': true,
  //   style: { width: '100%' },
  //   clearable: true,
  //   'prefix-icon': '',
  //   'suffix-icon': '',
  //   maxlength: null,
  //   'show-word-limit': false,
  //   readonly: false,
  //   disabled: false
  // },
  {
    __config__: {
      label: '数字输入框',
      showLabel: true,
      changeTag: true,
      labelWidth: null,
      tag: 'form-input-number',
      tagIcon: 'number',
      defaultValue: undefined,
      span: 24,
      layout: 'colFormItem',
      required: true,
      regList: [],
    },
    placeholder: '',
    min: undefined,
    max: undefined,
    step: 1,
    'step-strictly': false,
    precision: undefined,
    'controls-position': '',
    disabled: false,
    readonly: false
  },
  {
    __config__: {
      label: '富文本输入框',
      showLabel: true,
      changeTag: true,
      labelWidth: null,
      tag: 'form-rich-text',
      tagIcon: 'rich-text',
      defaultValue: null,
      span: 24,
      layout: 'colFormItem',
      required: true,
      regList: [],
    },
    placeholder: '请输入',
    // height: 250, // 编辑器高度
    disabled: false,
    readonly: false,
    maxlength: '20000',
    transcoding: true,
  }
]

// 选择型组件 【左面板】
export let selectComponents = [
  {
    __config__: {
      label: '下拉选择',
      showLabel: true,
      labelWidth: null,
      tag: 'form-select',
      tagIcon: 'select',
      layout: 'colFormItem',
      span: 24,
      required: true,
      regList: [],
      changeTag: true,
    },
    __slot__: {
      options: [{
        label: '选项一',
        value: '1'
      }, {
        label: '选项二',
        value: '2'
      }]
    },
    placeholder: '请选择',
    style: { width: '100%' },
    clearable: true,
    disabled: false,
    readonly: false,
    filterable: false,
    // multiple: false
  },
  {
    __config__: {
      label: '级联选择',
      // url: 'https://www.fastmock.site/mock/f8d7a54fb1e60561e2f720d5a810009d/fg/cascaderList',
      // method: 'get',
      // dataPath: 'list',
      dataConsumer: 'options',
      showLabel: true,
      labelWidth: null,
      tag: 'form-cascader',
      tagIcon: 'cascader',
      layout: 'colFormItem',
      defaultValue: [],
      dataType: 'static',
      span: 24,
      required: true,
      regList: [],
      changeTag: true,
    },
    options: [{
      id: '1',
      value: '1',
      label: '选项1',
      children: [{
        id: '2',
        value: '2',
        label: '选项1-1'
      }]
    }],
    placeholder: '请选择',
    style: { width: '100%' },
    props: {
      props: {
        // multiple: false,
        label: 'label',
        value: 'value',
        children: 'children'
      }
    },
    'show-all-levels': true,
    disabled: false,
    readonly: false,
    clearable: true,
    filterable: false,
    separator: '/'
  },
  {
    __config__: {
      label: '单选框组',
      labelWidth: null,
      showLabel: true,
      tag: 'form-radio-group',
      tagIcon: 'radio',
      changeTag: true,
      defaultValue: undefined,
      layout: 'colFormItem',
      span: 24,
      optionType: 'default',
      regList: [],
      required: true,
      border: false,
    },
    __slot__: {
      options: [{
        label: '选项一',
        value: '1'
      }, {
        label: '选项二',
        value: '2'
      }]
    },
    style: {},
    size: 'medium',
    disabled: false,
    readonly: false,
  },
  {
    __config__: {
      label: '多选框组',
      tag: 'form-checkbox-group',
      tagIcon: 'checkbox',
      defaultValue: '',
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      optionType: 'default',
      required: true,
      regList: [],
      changeTag: true,
      border: false,
    },
    __slot__: {
      options: [{
        label: '选项一',
        value: '1'
      }, {
        label: '选项二',
        value: '2'
      }]
    },
    style: {},
    size: 'medium',
    min: null,
    max: null,
    disabled: false,
    readonly: false,
  },
  {
    __config__: {
      label: '开关',
      tag: 'form-switch',
      tagIcon: 'switch',
      defaultValue: false,
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      required: true,
      regList: [],
      changeTag: true,
    },
    style: {},
    disabled: false,
    readonly: false,
    'active-text': '',
    'inactive-text': '',
    'active-color': null,
    'inactive-color': null,
    'active-value': true,
    'inactive-value': false
  },
  {
    __config__: {
      label: '滑块',
      tag: 'form-slider',
      tagIcon: 'slider',
      defaultValue: null,
      span: 24,
      showLabel: true,
      layout: 'colFormItem',
      labelWidth: null,
      required: true,
      regList: [],
      changeTag: true,
    },
    disabled: false,
    readonly: false,
    min: 0,
    max: 100,
    step: 1,
    'show-stops': false,
    range: false
  },
  {
    __config__: {
      label: '时间选择',
      tag: 'form-time-picker',
      tagIcon: 'time',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框只读
      span: 24,
      showLabel: true,
      layout: 'colFormItem',
      labelWidth: null,
      required: true,
      regList: [],
      changeTag: true,
    },
    placeholder: '请选择',
    style: { width: '100%' },
    disabled: false,
    readonly: false,
    clearable: true,
    'picker-options': {
      selectableRange: '00:00:00-23:59:59'
    },
    format: 'HH:mm:ss',
    'value-format': 'HH:mm:ss'
  },
  {
    __config__: {
      label: '时间区间',
      tag: 'form-timerange-picker',
      tagIcon: 'time-range',
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框只读
      required: true,
      regList: [],
      changeTag: true,
    },
    style: { width: '100%' },
    disabled: false,
    readonly: false,
    clearable: true,
    'is-range': true,
    'range-separator': '至',
    'start-placeholder': '开始时间',
    'end-placeholder': '结束时间',
    format: 'HH:mm:ss',
    'value-format': 'HH:mm:ss'
  },
  {
    __config__: {
      label: '日期选择',
      tag: 'form-date-picker',
      tagIcon: 'date',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框只读
      showLabel: true,
      labelWidth: null,
      span: 24,
      layout: 'colFormItem',
      required: true,
      regList: [],
      changeTag: true,
    },
    placeholder: '请选择',
    type: 'date',
    style: { width: '100%' },
    disabled: false,
    clearable: true,
    format: 'yyyy-MM-dd',
    'value-format': 'yyyy-MM-dd',
    readonly: false
  },
  {
    __config__: {
      label: '日期区间',
      tag: 'form-daterange-picker',
      tagIcon: 'date-range',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框只读
      span: 24,
      showLabel: true,
      labelWidth: null,
      required: true,
      layout: 'colFormItem',
      regList: [],
      changeTag: true,
    },
    style: { width: '100%' },
    type: 'daterange',
    'range-separator': '至',
    'start-placeholder': '开始日期',
    'end-placeholder': '结束日期',
    disabled: false,
    clearable: true,
    format: 'yyyy-MM-dd',
    'value-format': 'yyyy-MM-dd',
    readonly: false
  },
  {
    __config__: {
      label: '日期时间选择',
      tag: 'form-date-picker',
      tagIcon: 'date',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框只读
      showLabel: true,
      labelWidth: null,
      span: 24,
      layout: 'colFormItem',
      required: true,
      regList: [],
      changeTag: true,
    },
    placeholder: '请选择',
    type: 'datetime',
    style: { width: '100%' },
    disabled: false,
    clearable: true,
    format: 'yyyy-MM-dd HH:mm:ss',
    'value-format': 'yyyy-MM-dd HH:mm:ss',
    readonly: false
  },
  {
    __config__: {
      label: '日期时间区间',
      tag: 'form-daterange-picker',
      tagIcon: 'date-range',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框只读
      span: 24,
      showLabel: true,
      labelWidth: null,
      required: true,
      layout: 'colFormItem',
      regList: [],
      changeTag: true,
    },
    style: { width: '100%' },
    type: 'datetimerange',
    'range-separator': '至',
    'start-placeholder': '开始日期',
    'end-placeholder': '结束日期',

    clearable: true,
    format: 'yyyy-MM-dd HH:mm:ss',
    'value-format': 'yyyy-MM-dd HH:mm:ss',
    disabled: false, // 编辑状态禁用
    readonly: false, // 编辑状态的只读
    showonly: false, // 只显示详情状态（非编辑状态）
  },
  {
    __config__: {
      label: '评分',
      tag: 'form-rate',
      tagIcon: 'rate',
      defaultValue: 0,
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      required: true,
      regList: [],
      changeTag: true,
    },
    style: {},
    max: 5,
    'allow-half': false,
    'show-text': false,
    'show-score': false,
    disabled: false,
    readonly: false,
    color: '#F7BA2A',
    voidColor: '#C6D1DE',
  },
  {
    __config__: {
      label: '签名',
      tag: 'form-signature',
      tagIcon: 'signature',
      defaultValue: null,
      defaultValueHidden: true,
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      required: true,
      regList: [],
      changeTag: true,
    },
    placeholder: '点击签名',
    disabled: false,
    readonly: false,
    // width: 400,
    // height: 300,
    bgColor: '', // 背景颜色
    lineWidth: 4, // 画笔粗细
    lineColor: "#000", // 画笔颜色

  },
  // {
  //   __config__: {
  //     label: '颜色选择',
  //     tag: 'form-color-picker',
  //     tagIcon: 'color',
  //     span: 24,
  //     defaultValue: null,
  //     showLabel: true,
  //     labelWidth: null,
  //     layout: 'colFormItem',
  //     required: true,
  //     regList: [],
  //     changeTag: true,
  //   },
  //   'show-alpha': false,
  //   'color-format': '',
  //   disabled: false,
  // readonly: false,
  //   size: 'medium'
  // },
  {
    __config__: {
      label: '附件',
      tag: 'form-upload',
      tagIcon: 'upload',
      layout: 'colFormItem',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框隐藏
      showLabel: true,
      labelWidth: null,
      required: true,
      span: 24,
      showTip: true,
      regList: [],
      changeTag: true,
      fileSize: 2,
      sizeUnit: 'MB',
    },
    action: '/ECS/sys/file/upload',
    download: '/ECS/sys/file/download',
    dName: 'fileId',
    disabled: false,
    readonly: false,
    accept: '',
    limit: 10,
    name: 'multipartFiles',
    multiple: true
  },
  {
    __config__: {
      label: '图片',
      tag: 'form-image',
      tagIcon: 'image',
      layout: 'colFormItem',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框隐藏
      showLabel: true,
      labelWidth: null,
      required: true,
      span: 24,
      showTip: true,
      regList: [],
      changeTag: true,
      fileSize: 2,
      sizeUnit: 'MB',
    },
    disabled: false,
    readonly: false,
    limit: 10,
    multiple: true
  },
  {
    __config__: {
      label: '人员选择',
      tag: 'form-user-picker',
      tagIcon: 'person',
      layout: 'colFormItem',
      defaultValue: null,
      defaultValueHidden: true, // 默认值输入框只读
      showLabel: true,
      labelWidth: null,
      required: true,
      span: 24,
      regList: [],
      changeTag: true,
      url: '/ECS/oa/org/tree',
      method: 'get',
      // dataPath: 'list',
      dataType: 'dynamic',
      searchKey: 'userName',
    },
    props: {
      // 请求数据映射
      request: {
        deptId: 'deptId'
      },
      // 响应数据映射
      response: {
        id: 'id',
        name: 'name',
        type: 'type',
        avatar: 'avatar',
      }
    },
    disabled: false,
    readonly: false,
    multiple: false,
    // enablePrint: true, // 可打印
    placeholder: '请选择人员',
  },
  // {
  //   __config__: {
  //     label: '部门选择',
  //     tag: 'form-org-picker',
  //     tagIcon: 'dept',
  //     layout: 'colFormItem',
  //     defaultValue: null,
  //     defaultValueHidden: true, // 默认值输入框只读
  //     showLabel: true,
  //     labelWidth: null,
  //     required: true,
  //     span: 24,
  //     regList: [],
  //     changeTag: true,
  //     url: '/ECS/oa/org/tree',
  //     method: 'get',
  //     // dataPath: 'list',
  //     dataType: 'dynamic',
  //     searchKey: 'userName',
  //   },
  //   props: {
  //     // 请求数据映射
  //     request: {
  //       deptId: 'deptId'
  //     },
  //     // 响应数据映射
  //     response: {
  //       id: 'id',
  //       name: 'name',
  //       type: 'type',
  //       avatar: 'avatar',
  //     }
  //   },
  //   disabled: false,
  //   readonly: false,
  //   multiple: false,
  //   // enablePrint: true, // 可打印
  //   placeholder: '请选择部门',
  // },
]

// 布局型组件 【左面板】
export let layoutComponents = [
  {
    __config__: {
      tag: 'form-row-container',
      layout: 'rowFormItem',
      tagIcon: 'row',
      label: '行容器',
      layoutTree: true,
      children: []
    },
    type: 'default',
    justify: 'start',
    align: 'top'
  },
  {
    __config__: {
      label: '分割线',
      tag: 'form-divider',
      defaultValue: '分割线',
      tagIcon: 'divider',
      span: 24,
      layout: 'colFormItem',
    },
    icon: '',
    contentPosition: 'center', // 分割线文案位置
  },
  {
    __config__: {
      label: '说明',
      tag: 'form-remark',
      tagIcon: 'remark',
      defaultValue: '只是一段说明文字',
      span: 24,
      showLabel: true,
      layout: 'colFormItem',
      labelWidth: null,
    },
    textColor: '', // 文字颜色
    icon: 'el-icon-warning-outline', // 图标
  },
  // {
  //   __config__: {
  //     label: '表格',
  //     tag: 'form-table',
  //     tagIcon: 'table',
  //     defaultValue: null,
  //     span: 24,
  //     showLabel: true,
  //     layout: 'colFormItem',
  //     labelWidth: null,
  //     changeTag: true,
  //     dataType: 'static',
  //   },
  //   headData: [],
  //   data: [],
  //   stripe: false,
  //   border: false,
  //   size: 'medium',
  //   showHeader: true,
  //   'highlight-current-row': false
  // },
]



export function setConfig(defaultConfig) {
  if (!defaultConfig) return
  if (!Object.keys(defaultConfig).length) return
  // 1. 表单配置
  if (defaultConfig.formConf) formConf = deepClone(defaultConfig.formConf)
  // 2.1 输入型组件 【左面板】
  if (defaultConfig.inputComponents) inputComponents = deepClone(defaultConfig.inputComponents)
  // 2.2 选择型组件 【左面板】
  if (defaultConfig.selectComponents) selectComponents = deepClone(defaultConfig.selectComponents)
  // 2.3 布局型组件 【左面板】
  if (defaultConfig.layoutComponents) layoutComponents = deepClone(defaultConfig.layoutComponents)
}
